import { RouteRecordRaw } from "vue-router";
import useUserStore from "@/store/user";
import actionToken from "@/tools/actionToken";

// 路由表的配置
const routes: Array<RouteRecordRaw> = [
    {//网站根路径默认为home路由组件
        path: "/",
        name: "Home",
        component: () => import("@/pages/home/index.vue")
    },
    {//分类
        path: '/category',
        redirect: "/category/list",
        name: 'Category',
        children: [
            { //一级分类页面
                path: "/category/list",
                name: "CategoryList",
                component: () => import("@/pages/category/index.vue"),
            },
            { //分类详情页
                path: '/category/detail/:id?',
                name: 'Detail',
                props: true,
                component: () => import("@/pages/category/detail/index.vue"),
                beforeEnter(to, from, next) {
                    const id = useUserStore().state.id;
                    const token = actionToken.getToken();
                    if (token || id) {
                        next();
                    } else {
                        next({ path: "/login" });//此时不该访问登录页的，直接将页面跳转至404
                    }
                }
            },
        ]
    },
    {
        //听单
        path: "/listen-list",
        name: 'listen-list',
        component: () => import("@/pages/listen-list/index.vue")
    },
    {  //登录
        path: "/login",
        name: "Login",
        component: () => import("@/pages/login/index.vue"),
        // 路由独享守卫 ：登录页不应该可以被用户重复访问。所以要对登录页做限制。
        beforeEnter(to, from, next) {
            const id = useUserStore().state.id;
            const token = actionToken.getToken();
            if (!token || !id) {
                next();
            } else {
                next({ path: "/" });//此时不该访问登录页的，直接将页面跳转至首页
            }
        }
    },
    {//搜索
        path: '/search',
        component: () => import('@/pages/search/index.vue')
    },
    {//排行榜
        path: '/rank',
        component: () => import("@/pages/rank/index.vue")
    },
    {//专辑页面：点击首页的`新人必听`和`限时免费`中的项时跳转的路由页面
        path: "/album/:albumId",
        name: "Album",
        props: true,
        component: () => import("@/pages/album/index.vue")
    },
    {//404页面
        path: "/404",
        component: () => import("@/pages/notFound/index.vue")
    },
    {//匹配任意路由组件
        path: "/:pathMatch(.*)",
        redirect: "/404"
    },
];


// 向外暴露路由表
export default routes;